﻿@section header {
    <style type="text/css">
        body
        {
            height: 100%;
            width: 100%;
        }
        .MBmenu li
        {
            background: url(/Content/images/book.png) no-repeat 2px 2px;
        }
    </style>
    <script type="text/javascript">
        var msgShow = function (id, text) {
            this.parent.addTab('/office/myOffice/MsgShow?id=' + id, '消息:' + text);
            window.setTimeout(getUnReadCount, 3000);
        };

        var msgNew = function () {
            this.parent.addTab('/office/myOffice/MsgNew', '新建消息');
            window.setTimeout(getUnReadCount, 3000);
        }

        var refreshMsg;
        var getUnReadCount

        Ext.onReady(function () {
            Ext.regModel('info', {
                fields: [
                    { name: 'ID', type: 'string' },
                    { name: 'Title', type: 'string' },
                    { name: 'Sender', type: 'string' },
                    { name: 'SendDate', type: 'string' },
                    { name: 'SendDateTime', type: 'string' },
                    { name: 'Receivers', type: 'string' }
            ]
            });

            refreshMsg = function (type, title) {
                grid.setTitle(title);
                store.load({ params: { type: type} });
            }

            var store = new Ext.data.Store({
                model: 'info',
                groupDir: 'DESC',
                groupField: 'SendDate',
                proxy: {
                    type: 'ajax',
                    url: '/data/info',
                    extraParams: { type: 'unread' }, //传参数,在Request.Params["mrId"]
                    reader: {
                        type: 'json',
                        root: 'data'
                    }
                },
                autoLoad: true,
                listeners: {
                    load: function (store, records, success) {
                        getUnReadCount();
                    }
                }
            });

            getUnReadCount = function () {
                Ext.Ajax.request({
                    url: '/data/info/unReadCount',
                    //                    params: {
                    //                        id: 1
                    //                    },
                    success: function (response, opts) {
                        //debugger;
                        Ext.fly('unRead').dom.innerText = "(" + response.responseText + ")";
                    },
                    failure: function (response, opts) {
                        debugger;
                    }
                });
            };

            window.setInterval(getUnReadCount,20000);

            var grid = new Ext.grid.GridPanel({
                id: 'grid001',
                //                frame: true,
                store: store,
                margin: 6,
                //selModel: new Ext.selection.CheckboxModel({}),
                tbar: [
                { xtype: 'tbseparator' },
                { xtype: 'tbfill' },
                { xtype: 'button', iconCls: 'iconRefresh', text: '', tooltip: '刷新', tooltipType: 'title', handler: function (source, e) { privilegeGridRefresh() } }
            ],
                title: '消息列表',
                features: [{
                    ftype: 'grouping',
                    groupHeaderTpl: '发送日期: {name} ' //API文档错误,groupHdTpl无效
                }],
                columns: [
                new Ext.grid.RowNumberer(), //序号乱,暂时不显示
                {
                text: 'ID',
                flex: 1,
                dataIndex: 'ID',
                hidden: true
            }, {
                text: '发件人',
                dataIndex: 'Sender',
                width: 100
            }, {
                text: '标题',
                dataIndex: 'Title',
                renderer: function (val, meta, record) { return '<a href="javascript:msgShow(\'' + record.data.ID + '\',\'' + val + '\')">' + val + '</a>'; },
                flex: 1
            }, {
                text: '收件人',
                dataIndex: 'Receivers',
                width: 160
            }, {
                text: '发送时间',
                dataIndex: 'SendDateTime',
                width: 140
            }],
            listeners: {
                itemdblclick: function (view, record, el, index, e) {
                },
                selectionchange: function (view, selections) {
                    //                    debugger;
                }
            }
        });

        var msgPanel = new Ext.panel.Panel({
            title: '我的消息',
            bodyPadding: 0,
            width: '100%',
            tbar: [
                { xtype: 'tbseparator' },
                { xtype: 'tbfill' },
                { xtype: 'button', iconCls: 'iconRefresh', text: '', tooltip: '刷新', tooltipType: 'title', handler: function (source, e) { privilegeGridRefresh() } }
            ],
            html: '<ul class="MBmenu"><li><a href="javascript:msgNew()">新建消息</a></li><li><a href="javascript:refreshMsg(\'unread\',\'未读消息\')">未读消息<span id="unRead">(10)</span></a></li><li><a href="javascript:refreshMsg(\'all\',\'收件箱\')">收件箱</a></li><li><a href="javascript:refreshMsg(\'outbox\',\'发件箱\')">发件箱</a></li><li><a>回收站</a></li></ul>'
        });

        var subPanel = new Ext.grid.Panel({
            store: new Ext.data.Store({
                fields: ['ID', 'Title'],
                proxy: {
                    type: 'ajax',
                    url: '/data/Info/selfSubscription'
                },
                autoLoad: true
            }),
            title: '我的订阅',
            bodyPadding: 0,
            width: '100%',
            flex: 1,
            margin: '6 0 6 0',
            tbar: [
                { xtype: 'button', iconCls: 'iconEdit', text: '', tooltip: '修改订阅', tooltipType: 'title', handler: function (source, e) { window.parent.addTab('/office/myoffice/mySubscription', '我的订阅') } },
                { xtype: 'button', iconCls: 'iconGo', text: '', tooltip: '到公告板', tooltipType: 'title', handler: function (source, e) { window.parent.addTab('/office/myoffice/boards', '公告板') } },
                { xtype: 'tbseparator' },
                { xtype: 'tbfill' },
                { xtype: 'button', iconCls: 'iconRefresh', text: '', tooltip: '刷新', tooltipType: 'title', handler: function (source, e) { subPanel.store.load(); } }
            ],
            columns: [
            new Ext.grid.RowNumberer(),
            {
                text: '标题',
                dataIndex: 'Title',
                flex: 1,
                renderer: function (v) { return '<a href="javascript:window.parent.addTab(\'/office/myoffice/boards\',\'公告板\')">' + v + '</a>' }
            }
            ]
        });

        var leftContainer = new Ext.container.Container({
            flex: 0,
            width: 200,
            layout: 'vbox',
            margin: '6 0 6 6', bodyPadding: 0, padding: 0, autoScroll: true,
            items: [
                msgPanel,
                subPanel,
                {
                    xtype: 'form',
                    title: '消息通道设置',
                    //height: 100,
                    layout: 'anchor',
                    width: '100%',
                    bodyPadding: 6,
                    defaults: { labelWidth: 60 },
                    items: [{
                        xtype: 'checkboxfield',
                        name: 'sms',
                        fieldLabel: '手机短信',
                        anchor: '100%'
                        }, {
                        xtype: 'checkboxfield',
                        name: 'email',
                        fieldLabel: '电子邮件',
                        anchor: '100%'
                    }],
                    tbar: [{
                        xtype: 'button',
                        iconCls: 'iconSave',
                        tooltip: '保存设置',
                        tooltipType: 'title',
                        handler: function (source, e) {
                            //debugger;
                            this.up('form').getForm().submit({
                                url: '/office/myOffice/saveReceiverType',
                                success: function (form, action) { alert('保存成功!'); },
                                failure: function (form, action) { alert('failure') }
                            }
                            );
                        }
                    }],
                    listeners: {
                        afterrender: function (cmp) {
                            //debugger;
                            cmp.getForm().load({
                                url: '/office/myOffice/loadReceiverType'
                            }
                            );
                        }
                    }
                }
            ]
        });

        Ext.create('Ext.container.Viewport', {
            layout: 'fit',
            border: 0,
            items: [{
                layout: {
                    type: 'hbox',
                    align: 'stretch'
                    //pack: 'start'
                },
                //oadMask: { msg: 'Please wait...' },
                defaults: {
                    flex: 1 //子元素平均分配宽度
                },
                split: true,
                autoScroll: true,
                bodyPadding: 0,
                padding: 0,
                margin: 0,
                tbar: [
                { xtype: 'label', text: '我的消息中心 -> 消息列表', cls: 'formNav' },
                { xtype: 'button', iconCls: 'iconRefresh', tooltip: '刷新，尚未实现！', tooltipType: 'title', handle: function (source, e) { window.location.href = window.location.href; } },
                { xtype: 'tbfill' },
                { xtype: 'button', iconCls: 'helpIcon', tooltip: '帮助', tooltipType: 'title', handle: function (source, e) { alert('帮助!') } },
                { xtype: 'button', iconCls: 'iconClose', text: '', tooltip: '关闭', tooltipType: 'title', handler: function (source, e) { window.parent.closeMe(window) } }
            ],
                bbar: [
                { xtype: 'button', text: 'Button 1', handler: function (source, e) { openWindow(); } }
            ],
                items: [leftContainer, grid]
            }]
        });
        refreshMsg('unread', '未读消息');
    });
    </script>
}